<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="#0A5AF9">
    <title>购买</title>
    <link rel="stylesheet" type="text/css" href="../css/public-head.css" />
    <link rel="stylesheet" type="text/css" href="../css/purchase.css" />
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/mui.min.css" />
</head>
<style>
    html,
    body {
        background: #EEEEEE;
    }

    * {
        margin: 0;
        padding: 0;
    }
</style>

<body>
    <div class="main">
        <div class="purchase-list">
            <div class="many">
                <div class="manybox">
                    <div><img src="../image/oilCard/fwcn-2@2x.png" alt="" /></div>
                    <div>一充多用</br>随时消费</div>
                </div>
            </div>
            <div class="transaction">
                <div class="transactionbox">
                    <div><img src="../image/oilCard/fwcn-3@2x.png" alt="" /></div>
                    <div>交易密码</br>资金安全</div>
                </div>
            </div>
        </div>
        <!--列表-->
        <div class="list-surface">
            <div class="list">
                <div class="list_word">
                    <div>充值明细</div>
                </div>
                <div class="list_no">
                    <div>
                        <div>100元/即时充值</div><span class="list_no_img"><img src="../image/icon/ARROWRIGHT@2x.png" alt="" /></span></div>
                </div>
            </div>
            <div class="list" tapmode onclick="refueling_card()">
                <div class="list_word">
                    <div>加油卡号</div>
                </div>
                <div class="list_no">
                    <div>
                        <div>23456566****</div><span class="list_no_img"><img src="../image/icon/ARROWRIGHT@2x.png" alt="" /></span></div>
                </div>
            </div>
            <div class="list">
                <div class="list_word">
                    <div>代金券</div>
                </div>
                <div class="list_no">
                    <div>
                        <div>无可用</div><span class="list_no_img"><img src="../image/icon/ARROWRIGHT@2x.png" alt="" /></span></div>
                </div>
            </div>
            <div class="list">
                <div class="list_word">
                    <div>支付方式</div>
                </div>
                <div class="list_no">
                    <div>
                        <div>支付宝</div><span class="list_no_img"><img src="../image/icon/ARROWRIGHT@2x.png" alt="" /></span></div>
                </div>
            </div>
        </div>
        <!-- 提示语 -->
        <div class="language">加油时需圈存，发票可向油站工作人员索取</div>
        <div class="agreement">
        	<div class="box">
        		<input class="checkBox" type="checkBox" value="" /><span>同意</span><a href="#">《车车侠服务条款》</a>
        	</div>
            <div class="actual">
            	<span>实付金额：</span>
            	<span>99</span>
            	<span>元</span>
            </div>
        </div>
        <div class="confirm-purchase" tapmode onclick="OnlinePayment()"><button>确认购买</button></div>
    </div>


</body>
<script type="text/javascript" src="../script/public-head.js"></script>
<script type="text/javascript" src="../script/rem.js"></script>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/mui.js"></script>
<script type="text/javascript">
    headInner({
        title: "",
        //headleft
        headl: '<a href="javascript:history.back(-1)" style="color:white" class="mui-icon mui-icon-left-nav" tapmode onclick="api.closeWin()"></a>',
        //headright
        headr: '<a style="color:white"></a>',
        color: "", //默认是蓝色
        padding: "0px 0px 0px",
    })

	function refueling_card() {
		 api.openWin({
            name: 'refueling-card',
            url: '../html/refueling-card.html'
        });
	}
	function OnlinePayment() {
		 api.openWin({
            name: 'online-payment',
            url: '../html/online-payment.html'
        });
	}
</script>

</html>
